<template>
              <div class="popperUser">
                <div v-if="uid!==''" class="popperUsertitle">
                  <div>
                    <el-avatar :size="45" :src="userXx.avatar" />
                  </div>
                  <div>
                    <div>
                      <p>{{ userXx.username }}</p>
                      <p>写点呗0.0</p>
                    </div>
                  </div>
                </div>
                <div @click="siginclick" v-if="uid!==''" class="popperqiandao">
                  <p>
                    <Icons type="icon-rili" style="font-size: 16px;"></Icons>
                  </p>
                  <p>{{sigin==='1'?'点击签到':'今天已签到'}}</p>
                </div>
                <div v-if="uid!==''" class="popperfen">
                  <div>
                    <div>
                      <p>余额</p>
                    </div>
                    <div>
                      <p>{{blances }}</p>
                      <p>
                        <Icons type="icon-yue01" style="font-size: 25px;"></Icons>
                      </p>
                    </div>
                  </div>
                  <div>
                    <div>
                      <p>积分</p>
                    </div>
                    <div>
                      <p>{{integrals}}</p>
                      <p>
                        <Icons type="icon-yue" style="font-size: 25px;"></Icons>
                      </p>
                    </div>
                  </div>

                </div>
                <div v-if="uid!==''" class="popperfenlitite">
                  <!-- <div>
                    <el-tooltip effect="dark" content="文章" placement="top">
                      <p>
                        <Icons type="icon-rili" style="font-size: 16px;"></Icons>0
                      </p>
                    </el-tooltip>

                  </div> -->
                  <div>
                    <el-tooltip effect="dark" content="帖子" placement="top">
                      <p>
                        <Icons type="icon-rili" style="font-size: 16px;"></Icons>0
                      </p>
                    </el-tooltip>
                  </div>
                  <div>
                    <el-tooltip effect="dark" content="评论" placement="top">
                      <p>
                        <Icons type="icon-xiaoxi-zhihui" style="font-size: 16px;"></Icons>0
                      </p>
                    </el-tooltip>
                  </div>
                  <div>
                    <el-tooltip effect="dark" content="人气值" placement="top">
                      <p>
                        <Icons type="icon-renqi" style="font-size: 16px;"></Icons>0
                      </p>
                    </el-tooltip>
                  </div>
                </div>
                <div class="popperfoot">
                  <div v-if="uid!==''">
                    <p>
                      <Icons type="icon-yonghu2" style="font-size: 15px;"></Icons>
                    </p>
                    <p>用户中心</p>
                  </div>
                  <div v-if="uid!==''">
                    <p>
                      <Icons type="icon-xiazai1" style="font-size: 15px;"></Icons>
                    </p>
                    <p>退出登录</p>
                  </div>
                  <div v-if="uid==''">
                    <p>
                      <Icons @click="addOrRg('login')" type="icon-yonghu2" style="font-size: 15px;"></Icons>
                    </p>
                    <p>登录</p>
                  </div>
                  <div v-if="uid==''">
                    <p>
                      <Icons @click="addOrRg('rg')" type="icon-xiazai1" style="font-size: 15px;"></Icons>
                    </p>
                    <p>注册</p>
                  </div>
                </div>
              </div>
          
  <loginandRg ref="loginandRgs"></loginandRg>
  
  <!-- display: grid;
  grid-template-columns: 20% 55% 25%; /* 三列，宽度分别为 30%, 40%, 30% */ -->
</template>

<script setup>
import { ref, reactive, defineProps, defineEmits ,computed,onMounted} from 'vue'
import {setCookie,deleteCookie} from '../function/Cookie '
import { Icons } from 'ikicons'
import {cookielogin,selectintegral,selectblance,selectsigin} from '@/api/request/userxx/requestuser'
import { ElAvatar, ElTooltip } from 'element-plus'
import { useCounterStore } from '@/store/index.js'
import loginandRg from '@/components/loginandRg.vue'
const store = useCounterStore()
const loginandRgs = ref(null)
const uid = computed(() => store.userid)
const Cookie = computed(() => store.Cookie)
const integrals =computed(() => store.integral.Integral)
const blances =computed(() => store.blance.balance)
const sigin =computed(() => store.sigin)
const userXx=computed(() => store.userXx) 
// const emit = defineEmits(["updateValue"]);
// const props = defineProps({
//   absolute: Boolean,
// })
const bycookielogin =async () => {
  try {
    const banks = await cookielogin()
    if (banks.status == 200) {
      
      store.loginset(banks.data.data[0].uid,banks.data.data[0],Cookie.value)
      await selectuser(banks.data.data[0].uid)
    }else{
      deleteCookie('sharingToken')
    }
  } catch (error) {

    deleteCookie('sharingToken')
  }
}
onMounted(async()=>{
  if(Cookie.value){
  
 await   bycookielogin()
}

})
//上面部分界面载入时候加载，下面部分写方法相关的

const  addOrRg =async(type) => {

 const loginXx=await loginandRgs.value.logininit(type)
 if(loginXx){
  store.loginset(loginXx.data[0].uid,loginXx.data[0],loginXx.cookie)
  await setCookie('sharingToken',loginXx.cookie,7)
  await  selectuser(loginXx.data[0].uid)
  //查询用户相关信息
 }
}

const selectuser = async (uid) => {
  try {
    const integral = await selectintegral({uid})
    const blance = await selectblance({uid})
    const sigin = await selectsigin({uid})
    store.changeintegral('integral',{Integralid:integral.data.data[0].Integralid,integral:integral.data.data[0].Integral})
    store.changeblance('blance',{balanceid:blance.data.data[0].balanceid,balance:blance.data.data[0].balance})
   if(sigin.data.stas==='1') store.changeData('sigin','1')
  } catch (error) {
    
  }
}
const siginclick =async ()=>{

  switch (sigin.value) {
    case '1':
    const sigin = await selectsigin({uid:store.userid,needadd:1})
    if(sigin.data.stas==='0') {
      store.changeData('sigin','0')
      store.changeintegral('integral',{Integralid:store.integral.Integralid,integral:sigin.data.data})
    }
      break;
  
    default:
      break;
  }
}
</script>

<style>
@import '@/assets/css/userxx.css';
</style>